<template>
  <el-dialog title="站点可发货国家配置" width="720" :modelValue="modelValue" @close="handleClose" draggable align-center :close-on-click-modal="false">
    <!-- <el-form ref="formRef" :model="formInline" labelPosition="top"> -->
    <el-table :data="formInline.tableData" border style="width: 100%">
      <el-table-column prop="warehouseName" label="仓库名称" />
      <el-table-column prop="skuStockQuantity" label="当前数量" />
      <el-table-column label="编辑类型" width="180">
        <template #default="{ row, $index }">
          <!-- <el-form-item :prop="`tableData.${$index}.update_type`" :rules="[{ required: true, message: '请选择', trigger: 'change' }]"> -->
          <el-select v-model="row.update_type" placeholder="编辑类型" class="w-[100%]">
            <el-option label="替换" value="2" />
            <el-option label="累加" value="1" />
          </el-select>
          <!-- </el-form-item> -->
        </template>
      </el-table-column>
      <el-table-column label="编辑数量">
        <template #default="{ row, $index }">
          <!-- <el-form-item :prop="`tableData.${$index}.quantity`" :rules="[{ required: true, message: '请输入', trigger: 'blur' }]"> -->
          <el-input v-model="row.quantity" oninput="value=value.replace(/[^\d]/g, '')" />
          <!-- </el-form-item> -->
        </template>
      </el-table-column>
    </el-table>
    <!-- </el-form> -->
    <template #footer>
      <el-button @click="handleClose"> 取消 </el-button>
      <el-button type="primary" @click="save"> 确认 </el-button>
    </template>
  </el-dialog>
</template>

<script setup lang="jsx">
import { ElMessage } from "element-plus"
import { skuStockUpdate } from "../api.js"
const emit = defineEmits(["refresh"])
const props = defineProps({})
const modelValue = ref(false)

// const formRef = ref()
const formInline = ref({
  tableData: [],
})

onMounted(async () => {})

const handleClose = () => {
  modelValue.value = false
  formInline.value = { tableData: [] }
}
const save = () => {
  // console.log(formRef.value)
  // formRef.value.validate((valid) => {
  //   if (valid) {
  let sku_stock_list = formInline.value.tableData.map((v) => ({ warehouseId: v.warehouseId, update_type: v.update_type, quantity: v.quantity }))
  sku_stock_list = sku_stock_list.filter((v) => v.update_type && v.quantity)
  let params = {
    goods_id: formInline.value.goods_id,
    sku_stock_list,
  }
  if (params.sku_stock_list.length == 0) {
    return ElMessage({ showClose: true, message: "数据校验不通过", type: "warning" })
  }
  skuStockUpdate(params).then((res) => {
    handleClose()
    ElMessage.success("保存成功")
    emit("refresh")
  })
  // } else {
  //   console.log("error submit!")
  // }
  // })
}
const open = (row) => {
  modelValue.value = true
  formInline.value.tableData = row.sku_stock_list
  formInline.value.goods_id = row.id
}

defineExpose({
  open,
})
</script>
<style lang="scss" scoped></style>
